<template>
	<div id="container">
		<h1>{{msg}}</h1>
		123143
	</div>
</template>

<script>
	export default {
		name: 'HelloWorld',
		data() {
			return {
				msg: 'Welcome to Your Vue.js App'
			}
		},
		created() {
			this.init();
		},
		methods: {
			//初始化地图函数  自定义函数名init
			init: function() {
				//定义map变量 调用 qq.maps.Map() 构造函数   获取地图显示容器
				var map = new qq.maps.Map(document.getElementById("container"), {
					center: new qq.maps.LatLng(39.916527, 116.397128), // 地图的中心地理坐标。
					zoom: 8 // 地图的中心地理坐标。
				});
			}
		
		}
	}
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>
	#container {
		width: 300px;
		height: 400px;
		border: #42B983;
	}

	h1,
	h2 {
		font-weight: normal;
	}

	ul {
		list-style-type: none;
		padding: 0;
	}

	li {
		display: inline-block;
		margin: 0 10px;
	}

	a {
		color: #42b983;
	}
</style>
